<!DOCTYPE html>
<html>
<head>
    <title>Proxy Test</title>
</head>
<body>
    <h1>Proxy Test</h1>
    <button onclick="testProxy()">Test Proxy</button>
    <div id="result"></div>

    <script>
        function testProxy() {
            fetch('/api/login', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({
                    username: 'admin',
                    password: 'password'
                })
            })
            .then(response => {
                document.getElementById('result').innerText = 'Status: ' + response.status;
                return response.text();
            })
            .then(data => {
                document.getElementById('result').innerText += '\nResponse: ' + data;
            })
            .catch(error => {
                document.getElementById('result').innerText = 'Error: ' + error;
            });
        }
    </script>
</body>
</html>